<template>
	<div class="body">
		<div style="display: flex;">
			<div class="picture"><img :src="`http://127.0.0.1/api/public/showimg/${good.pic}`" />
			图片:<input type="file" ref="imgs" id="pic">
			<hr>
			</div>
			<div class="in">
				<el-form :model="good" ref="good" label-width="100px" class="demo-ruleForm">
					<el-form-item label="商品名称" prop="name">
						<el-input v-model="good.name"></el-input>
					</el-form-item>
					<el-form-item label="商品序号" prop="region">
						<el-input v-model="good.sn"></el-input>
						</el-select>
					</el-form-item>
					<el-form-item label="商品价格" prop="region">
						<el-input v-model="good.price"></el-input>
						</el-select>
					</el-form-item>
					<el-form-item label="商品厂商" prop="region">
						<el-input v-model="good.maker"></el-input>
						</el-select>
					</el-form-item>
					<el-form-item label="书籍作者" prop="region">
						<el-input v-model="good.author"></el-input>
						</el-select>
					</el-form-item>
					<el-form-item label="出厂时间" required>
						<el-col :span="11">
							<el-form-item prop="date1">
								<el-date-picker type="date" placeholder="选择日期" v-model="good.date" style="width: 100%;">
								</el-date-picker>
							</el-form-item>
						</el-col>
					</el-form-item>
					<el-form-item label="商品库存" prop="region">
						<el-input v-model="good.stock"></el-input>
						</el-select>
					</el-form-item>
					<!-- <el-form-item label="商品类型">
						<el-cascader :options="options" :show-all-levels="false" />
					</el-form-item> -->
					<el-form-item label="商品详情" prop="info">
						<el-input
						  type="textarea"
						  :rows="2"
						  placeholder="请输入内容"
						  v-model="good.info">
						</el-input>
					</el-form-item>
					<el-button type="primary" @click="submitForm('good')">立即修改</el-button>
					<el-button @click="resetForm('good')">重置</el-button>
				</el-form>
			</div>
		</div>

	</div>
</template>

<script>
	export default {
		name: 'UpdateGood',
		data() {
			return {
				good: {},
				type: [],
			}
		},
		methods: {
			getAllType() {
				this.$get('/api/adm/type/findAll2').then((resp) => {
					this.type = resp.data.data
				})
			},
			submitForm(formName) {
				this.$refs[formName].validate((valid) => {
					if (valid) {
						let fd = new FormData();
						let content = this.$refs.imgs.files[0];
						fd.append("mypic", content);
						fd.append("id", this.good.id)
						fd.append("sn",this.good.sn)
						fd.append("price",this.good.price)
						fd.append("memo",this.good.info)
						fd.append("author",this.good.author)
						// fd.append("tmake",this.good.tmake)
						fd.append("stock",this.good.stock)
						fd.append("maker",this.good.maker);
						console.log(fd);
						this.$postf("/api/adm/book/add", fd).then((resp) => {
							console.log(resp.data.data);
							this.good = resp.data.data
						
						})
					} else {
						console.log('error submit!!');
						return false;
					}
				});
			},
			resetForm(formName) {
				this.$refs[formName].resetFields();
			}
		},
		mounted() {
			this.good = this.$route.query.good;
		}
	}
</script>

<style>
	.body {

		margin: 0;
		padding: 0;
		width: 100%;
	}

	.picture {
		width: 50%;
	}

	.in {
		width: 50%;
	}
</style>
